import type { Plugin } from '../types'
import { Edit } from '@element-plus/icons-vue'

export const customInputPlugin: Plugin = {
  config: {
    name: 'custom-input',
    version: '1.0.0',
    description: '自定义输入组件插件',
    author: 'AdminMatrix',
    components: [
      {
        name: 'custom-input',
        metadata: {
          type: 'custom-input',
          category: 'form',
          label: '自定义输入框',
          icon: Edit,
          props: {
            base: {
              label: '自定义输入',
              placeholder: '请输入内容',
              required: false,
              clearable: true,
              'show-password': false,
              size: 'default'
            },
            style: {
              width: '100%'
            },
            baseSchema: {
              label: {
                type: 'string',
                label: '标签'
              },
              placeholder: {
                type: 'string',
                label: '占位提示'
              },
              required: {
                type: 'boolean',
                label: '必填'
              },
              clearable: {
                type: 'boolean',
                label: '可清除'
              },
              'show-password': {
                type: 'boolean',
                label: '密码框'
              },
              size: {
                type: 'select',
                label: '尺寸',
                options: [
                  { label: '默认', value: 'default' },
                  { label: '小', value: 'small' },
                  { label: '大', value: 'large' }
                ]
              }
            },
            styleSchema: {
              width: {
                type: 'string',
                label: '宽度'
              }
            }
          }
        },
        virtual: {
          type: 'custom-input',
          template: `
            <el-form-item
              :label="label"
              :required="required"
            >
              <el-input
                v-model="modelValue"
                v-bind="$attrs"
                :placeholder="placeholder"
                :clearable="clearable"
                :show-password="showPassword"
                :size="size"
                @update:modelValue="$emit('update:modelValue', $event)"
              />
            </el-form-item>
          `,
          props: {
            label: String,
            placeholder: String,
            modelValue: [String, Number],
            required: Boolean,
            clearable: Boolean,
            showPassword: Boolean,
            size: String
          },
          events: ['update:modelValue']
        }
      }
    ]
  }
} 